<!DOCTYPE html>
<html lang="zh">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
    <title>菜单管理</title>
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-touch-fullscreen" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="default">
    <script src="/statics/js/custom/lib.js?_V=1"></script>
    <link href="/statics/plugins/fontIconPicker/css/jquery.fonticonpicker.min.css" rel="stylesheet">
    <link href="/statics/plugins/fontIconPicker/themes/bootstrap-theme/jquery.fonticonpicker.bootstrap.min.css" rel="stylesheet" />
    <link href="/statics/plugins/jstree/style.min.css" rel="stylesheet">

</head>

<body ng-app="">
<div class="lyear-layout-web">
    <div class="lyear-layout-container">
        <!--左侧导航-->
        <ng-include src="'/admin/common/sidebar.html'"></ng-include>
        <!--End 左侧导航-->
        <!--头部信息-->
        <ng-include src="'/admin/common/header.html'"></ng-include>
        <!--End 头部信息-->

        <!--页面主要内容-->
        <main class="lyear-layout-content">
            <div class="container-fluid p-t-55">
                <div class="row">
                    <div class="col-lg-4">
                        <div class="card">
                            <div class="card-body pt-0">
                                <div class="card-header pr-0 pl-0">
                                    <div class="card-title">菜单管理</div>
                                </div>
                                <div id="menuTree" class="p-t-15"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </main>
        <!--End 页面主要内容-->
    </div>
</div>
<script type="text/javascript" src="/statics/js/apis/menu.js"></script>
<script type="text/javascript" src="/statics/js/apis/role.js"></script>
<script type="text/javascript" src="/statics/js/custom/select.js"></script>
<script type="text/javascript" src="/statics/plugins/fontIconPicker/jquery.fonticonpicker.min.js"></script>
<script type="text/javascript" src="/statics/plugins/jstree/jstree.min.js"></script>
<script type="text/javascript">

    function customMenu(node) {
        var dataId = node.a_attr.data_id;
        if (!dataId) {
            return false;
        }
        return true;    //注意要有返回值
    }

    //初始化树形
    function initmenuTree(){
        Request.builder()
            .url(MENU_LIST)
            .data({"page": 1, "pageSize": -1})
            .isToken(true)
            .callback(function (e) {
                var dataArray = [];
                var data = {};
                data.children = e.data;
                data.icon = "mdi mdi-file-outline"
                data.sort = 0
                data.state = {"opened": true}
                data.a_attr = {"data_id": "0"}
                data.text = "菜单管理"
                dataArray.push(data);
                $('#menuTree').jstree({
                    'core': {
                        'themes': {
                            'responsive': false
                        },
                        'data': dataArray,

                    }, "contextmenu": {
                        "items": customMenu
                    },
                    plugins: ["contextmenu"]
                });
            }).get()
    }

    $(function () {
        var font_element = $('#icon').fontIconPicker({
            theme: 'fip-bootstrap'
        });

        $.ajax({
            url: '/statics/plugins/fontIconPicker/fontjson/materialdesignicons.json',
            type: 'GET',
            dataType: 'json'
        }).done(function(response) {
            var fontello_json_icons = [];
            $.each(response.glyphs, function(i, v) {
                fontello_json_icons.push( v.css );
            });
            font_element.setIcons(fontello_json_icons);
        }).fail(function() {
            console.error('字体图标配置加载失败');
        });

        $(document).on('change', '#icon', function(){
            $('#show-mdi').html($(this).val());
        });

        //初始化菜单
        initmenuTree();
    });
</script>
</body>
</html>
